<template>
<view class="draft">
	
	<!-- <u-navbar bgColor='#4871C0' :titleStyle="{ color: '#FFF'}" title="草稿" leftIconColor="#FFF"
		@rightClick="rightClick" :autoBack="true"  >
	</u-navbar> -->
	
	<u-transition :show="true" mode="fade">
	
		<view class="newsList">
			<u-swipe-action v-if="listData.length!=0">
				<u-swipe-action-item
				  :options=" [{text: '删除'}]"
				 
				  v-for="(data,index) in listData"
				  @click='delDraftEvent(data.id)'
				  >
				  
				  <view class="newsItem" @tap.stop="gotoNewsDetail(data.id)">
					<view class="newsL">
						<view class="newsText">
							{{data.title}}
						</view>
						<view class="newsTime">
							修改于：{{data.updatetime}}
						</view>
					</view>
					<view class="newsR" v-if="!(data.diagram==''||data.diagram==null||data.diagram.length==0)"> 
						<image :src="data.diagram[0]" mode="widthFix"></image>
					</view>
				  </view>
				</u-swipe-action-item>

				<!-- <u-swipe-action-item
				  :options=" [{text: '删除'}]"
				  @click='delDraftEvent'
				  >
					<view class="newsItem">
						<view class="newsL">
							<view class="newsText">
								关于开展2022年下半年教师资格关于开展2022年下半年教师资格证考试（笔试）考试工作的安排
							</view>
							<view class="newsTime">
								2021.06.24 12:36
							</view>
						</view>
						<view class="newsR">
							
						</view>
					</view>
				</u-swipe-action-item>
				 -->


			</u-swipe-action>
			<u-empty
				v-else
				mode="list"
				icon="http://cdn.uviewui.com/uview/empty/list.png"
				marginTop='400rpx'
			>
			</u-empty>
	


		</view>
	
	</u-transition>
	
	<myTabBar :list='tabList' :currentIndex="2"></myTabBar>
	
</view>
</template>

<script>
import myTabBar from '@/component/customTabBar/customTabBar.vue'
import {
	footprintMine,
	deleteMeet
} from '@/api/schoolEventApi.js'
export default {
	components:{
		myTabBar
	},
	data() {
		return {
			tabList:[
				{title:"首页",url:"/pages/tabbar-5-detial/schoolEvent/schoolEvent",icon:"home"},
				{title:"待办",url:"/pages/tabbar-5-detial/backlog/backlog",icon:"chat"},
				{title:"草稿",url:"/pages/tabbar-5-detial/draft/draft",icon:"edit-pen"},
				{title:"我的发布",url:"/pages/tabbar-5-detial/myPublish/myPublish",icon:"file-text"},
				{
					title: "清外足迹",
					url: "/pages/tabbar-5-detial/schoolEvent/footConfig",
					icon: "file-text"
				}
			],
			limit: 10,
			page: 1,
			lastPage: 0,
			listData: [],


		}
	},
	onShow() {
		this.getListData();
	},
	methods: {
		delDraftEvent(id,e){
			uni.showModal({
			    title: '删除确认',
			    content: '是否删除该数据？',
				success: (res)=> {
			        if (res.confirm) {
						let params = {
							article_id:id
						};
						uni.showLoading({
							title: '删除中'
						});
			            deleteMeet(params).then(res => {
							console.log(res)
							uni.hideLoading();
							uni.showToast({
								title: res.msg,
								duration: 2000,
								icon:"none"
							});
							if(res.code == 1){
								this.getListData();
							}
						})
			        } else if (res.cancel) {
			            console.log('用户点击取消');
			        }
			    }
			});
		},
		gotoNewsDetail(id){
			uni.navigateTo({
				url: '/pages/tabbar-5-detial/schoolEvent/newsDetail/newsDetail?pageType=3&id='+id
			});
		},
		getListData(){
			let params = {
				time:'',
				status:1
			};
			uni.showLoading({
				title: '加载中'
			});
			footprintMine(params).then(res => {
				console.log(res)
				uni.hideLoading();
				if(res.code == 1) {
					this.listData = res.data.list.data;
					// this.lastPage = res.last_page;
					console.log(this.listData)
				} else {
					uni.showToast({
						title: res.msg,
						duration: 2000,
						icon:"none"
					});
				}
			})
		},

	},
	onReachBottom() {
		if(this.lastPage > this.page) {
			this.page++;
			this.getListData();
		}
	}
}
</script>

<style>
image{
	width: 100%;
}
.draft{
	background-color: #f8f8f8;
	
	width: 100%;
	min-height: 100vh;
}
.draft /deep/.u-swipe-action-item__right__button__wrapper{
	background-color: #fc8b00 !important;
}
.newsList{
	/* padding: 20rpx; */
}
.newsItem{
	display: flex;
	border-bottom: 1px dashed #eee;
	padding: 26rpx;
}

/* .newsR{
	height: 200rpx;
	width: 100%;
	margin-bottom: 20rpx;
} */

.newsTime{
	margin-top: 20rpx;
}
.newsL{
	display: flex;
	flex-direction: column;
	flex: 1;
}
.newsText{
	
	overflow: hidden;
	text-overflow: ellipsis;  /* 超出部分省略号 */
	word-break: break-all;  /* break-all(允许在单词内换行。) */  
	display: -webkit-box; /* 对象作为伸缩盒子模型显示 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	-webkit-line-clamp: 2; /* 显示的行数 */
}
.newsTime{
	margin-top: 40rpx;
	color: #aaa;
	font-size: 28rpx;
	display: flex;
	margin-top: auto;
}
.newsR{
	width: 300rpx;
	height: 200rpx;
	background-color: #f0f0f0;
	border-radius: 16rpx;
	overflow: hidden;
	margin-right: 20rpx;
	margin-left: 20rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}
</style>
